<template>
	<a-menu v-if="data" v-model="selectedKeys" theme="dark" mode="inline">
		<template v-for="item in data">
			<a-menu-item
				v-if="item.page_type == 1 && item.status == 1"
				:key="item.id"
			>
				<router-link :to="item.page_url">
					<i v-if="item.icon" class="anticon petter">
						<app-icon :value="item.icon" />
					</i>
					<span> {{ item.title }}</span>
				</router-link>
			</a-menu-item>
			<subMenu
				v-else-if="item.page_type == 0 && item.status == 1"
				:key="item.id"
				:menu-info="item"
			/>
		</template>
	</a-menu>
</template>

<script>
	export default {
		components: {
			subMenu: () => import("./sub-menu"),
		},
		props: {
			data: {
				type: Array,
				default: () => {
					return undefined
				},
			},
		},
		data() {
			return {
				selectedKeys: undefined,
			}
		},
		created() {},
		methods: {},
	}
</script>

<style lang="less" type="text/less" scoped></style>
